<div class="box">
    <!-- /.box-header -->
    <div class='box-head'>
        <table>
            <thead>
                <tr>
                    <th style="width: 5%">序号</th>
                    <th style="width: 10%">当事人名称</th>
                    <th style="width: 25%">地址</th>
                    <th style="width: 10%">案件来源</th>
                    <th style="width: 10%">案件类型</th>
                    <th style="width: 15%">案件编号</th>
                    <th style="width: 8%">立案时间</th>
                    <th style="width: 10%">备注</th>
                    <th style="width: 10%">办理时限（天）</th>
                    <th style="width: 10%">办理状态</th>
                    <th style="width: 10%">操作</th>
                </tr>
            </thead>
        </table>
    </div>

    <div class="box-body">
        <table class="m-table  m-table-striped" *ngIf="pageList.length>0;else elseBlock">
            <tbody>
                <tr *ngFor="let page of pageList;let i = index;">
                    <td style="width:5%">{{(i+1)}}</td>

                    <td style="width: 10%">
                        <span placement="bottom" ngbTooltip="{{page.partyName}}">
                            {{page.partyName}}
                        </span>
                    </td>
                    <td style="width: 25%">
                        <span placement="bottom" ngbTooltip=" {{page.addressDetail}}">
                            {{page.addressDetail}}
                        </span>
                    </td>
                    <td style="width: 10%">
                        <span placement="bottom" ngbTooltip=" {{page.sourceType|clueSource}}">
                            {{page.sourceType|clueSource}}
                        </span>
                    </td>
                    <td style="width: 10%">
                        <span placement="bottom" ngbTooltip="{{page.caseType}}">
                            {{page.caseType}}
                        </span>
                    </td>
               
                    <td style="width: 15%">
                        <span placement="bottom" ngbTooltip="{{page.code}}">
                            {{page.code}}
                        </span>
                    </td>

                    <td style="width: 8%">
                        <span placement="bottom" ngbTooltip="{{page.registerTime}}">
                            {{page.registerTime || ""}}
                        </span>
                    </td>

                    <td style="width: 10%">
                        <span placement="bottom" ngbTooltip="{{'备注：'+page.remark}}">
                            {{page.remark}}
                        </span>
                        <span ></span>
                    </td>

                    <td style="width: 10%">
                        <span placement="bottom" ngbTooltip=" {{page.timeLimit}}">
                            {{page.timeLimit}}
                        </span>
                    </td>
                    <td style="width: 10%">
                   
                       <ng-container *ngIf="page.caseStatus">
                          <span placement="bottom" ngbTooltip="{{page.caseStatus}}" >
                            {{page.caseStatus}}
                          </span>
                        </ng-container>

                    </td>
                    <td style="width: 10%">
                        <!-- <ng-container *ngIf="page.clueStatus=='03'">
                            <span class='table-add'> <a [routerLink]='["cluedetail",page.id]'>查看</a></span>
                        </ng-container>
                        <ng-container *ngIf="page.clueStatus!='03'">
                            <span class='table-add' *ngIf="page.currentHandlePerson==sessionUser"> <a [routerLink]='["edithandle",page.id]'>办理</a></span>
                            <span class='table-add' *ngIf="page.currentHandlePerson!=sessionUser"> <a [routerLink]='["cluedetail",page.id]'>查看</a></span>
                        </ng-container> -->
                        <!-- 如果当前登录人有审批权限：可以办理的条件新加 案件流转次数 > 1 -->
                        <ng-container *ngIf="type=='handle'; else elseApproval">
                            <ng-container *ngIf="(page.currentHandlePerson==sessionUser) && page.currentStatus !== '结案'; else elseHandleTemplate">
                                <span class='table-add'> 
                                    <a class='steps_btn_handle' [routerLink]='["detailsteps", page.id, type, "other"]'>办理</a>
                                </span>
                            </ng-container>
                            <ng-template #elseHandleTemplate>
                                <span class='table-add'> 
                                    <a class='steps_btn_look'  [routerLink]='["steps",page.id,type,"look"]'>查看</a>
                                </span>
                            </ng-template>
                        </ng-container>

                        <ng-template #elseApproval>
                          
                            <ng-container *ngIf="page.currentHandlePerson==sessionUser && page.currentStatus !== '结案'; else elseTpl">
                            <!--  下一阶段stage -->
                              <ng-container *ngIf="page.clueId && page.stage=='线索'; else elseTemplate">
                                    <span class='table-add'> 
                                        <a  class='steps_btn_handle' [routerLink]='["steps", page.id, type, "other"]'>办理</a>
                                    </span>
                                </ng-container>
                                <ng-template #elseTemplate>
                                    <span class='table-add'> 
                                        <a class='steps_btn_handle' [routerLink]='["steps", page.id, type, "other"]'>审批</a>
                                    </span>
                                </ng-template>
                            </ng-container>
                            <ng-template #elseTpl>
                                <span class='table-add'> 
                                    <a  class='steps_btn_look'[routerLink]='["steps",page.id,type,"look"]'>查看</a>
                                </span>
                            </ng-template>
                        </ng-template>
                    </td>
                </tr>
            </tbody>
        </table>
        <ng-template #elseBlock>
            <div style="margin:0 auto;position: relative;height:100%;">
                <img style="position: absolute;width:180px;height:150px; top: 50%;left: 50%;transform:translate(-50%,-50%);" src=''>
                <p style="
            transform:translate(-50%,-50%);
            position: absolute; 
            font-size:18px;
            width:180px;
            height:150px; 
            text-align: center;
            margin-top:150px;
            top:50%;
            left: 50%;" class="ant-empty-description"> 暂无数据 </p>
            </div>
        </ng-template>

    </div>
    <div class="box-footer clearfix">
        <app-paginator #paginator (goPage)="goToPage($event)" (goNext)="onNext($event)" (goPrev)="onPrev($event)" (goFirst)="onFirst($event)" (goLast)="onLast($event)" (goSelect)="onSelect($event)" [selectedLimit]="selectedLimit" [limitOptions]="limitOptions"
            [total]='total'></app-paginator>
    </div>
</div>